var SCREEN_HEIGHT;
var SCREEN_WIDTH;

function findDimensions(){
	
	if (window.innerWidth){
		SCREEN_WIDTH = window.innerWidth;
	}else if ((document.body) && (document.body.clientWidth)){
		SCREEN_WIDTH = document.body.clientWidth;
	}  
	if (window.innerHeight){
		SCREEN_HEIGHT = window.innerHeight;
	} else if ((document.body) && (document.body.clientHeight)){
		SCREEN_HEIGHT = document.body.clientHeight;
	}

	if (document.documentElement  && document.documentElement.clientHeight && document.documentElement.clientWidth){
		SCREEN_HEIGHT = document.documentElement.clientHeight;
		SCREEN_WIDTH = document.documentElement.clientWidth;
	}

	console.log(SCREEN_HEIGHT+'------'+SCREEN_WIDTH);
	$('.greeting_card_bg2').css({'background-size':'100%'+SCREEN_HEIGHT+'px'});

	$('#leafContainer').html('');


	var cssAnimation = document.createElement('style');

	var rules = document.createTextNode('@-webkit-keyframes drop{'+
		'0%{ -webkit-transform: translate(0px, -50px);}' +
	    '100%{-webkit-transform: translate(0px, '+SCREEN_HEIGHT+'px);}' +
	'}');
	cssAnimation.appendChild(rules);
	document.getElementById("leafContainer").appendChild(cssAnimation);

	init(SCREEN_WIDTH);

}

function init(){

    var NUMBER_OF_LEAVES = 3;
    var picUrl = 'img/phone1.png';
    var picUrl2 = 'img/phone2.png';
    var picUrl3 = 'img/phone3.png';
    var picUrl4 = 'img/phone4.png';
    var picUrl6 = 'img/phone5.png';

    var container = document.getElementById('leafContainer');

    for (var i = 0; i < NUMBER_OF_LEAVES; i++) 
    {
        container.appendChild(createALeaf(picUrl));
        container.appendChild(createALeaf(picUrl2));
        container.appendChild(createALeaf(picUrl3));
        container.appendChild(createALeaf(picUrl4));
        container.appendChild(createALeaf(picUrl6));
    }
}

function randomInteger(low, high)
{
    return low + Math.floor(Math.random() * (high - low));
}

function randomFloat(low, high)
{
    return low + Math.random() * (high - low);
}

function pixelValue(value)
{
    return value + 'px';
}

function durationValue(value)
{
    return value + 's';
}

function createALeaf(picUrl)
{



    var leafDiv = document.createElement('p');
    var image = document.createElement('img');
    
    image.src = picUrl;
    
    leafDiv.style.top = "-85px";

    leafDiv.style.left = pixelValue(randomInteger(0, SCREEN_WIDTH-40));
    // console.log(pixelValue(randomInteger(0, 500)));
    

    var spinAnimationName = (Math.random() < 0.5) ? 'clockwiseSpin' : 'counterclockwiseSpinAndFlip';

    leafDiv.style.webkitAnimationName = 'fade, drop';
    image.style.webkitAnimationName = spinAnimationName;


    var fadeAndDropDuration = durationValue(randomFloat(5, 11));


    leafDiv.style.webkitAnimationDuration = fadeAndDropDuration + ', ' + fadeAndDropDuration;

    var leafDelay = durationValue(randomFloat(0, 5));

    leafDiv.style.webkitAnimationDelay = leafDelay + ', ' + leafDelay;

    leafDiv.appendChild(image);

    return leafDiv;
}

$(function(){
	//获取设备的高度
	findDimensions();
	window.onresize=findDimensions;
})